{extend name="public:base" /}
{block name="content"}	

<div class="page-header">	
<h1>
	{$breadcrumb1}
	<small>
		<i class="ace-icon fa fa-angle-double-right"></i>
		{$breadcrumb2}
	</small>
	<small>
		<i class="ace-icon fa fa-angle-double-right"></i>
		{$crumbs}
	</small>			
<button name="send"  type="submit" style="float:right;"  class="btn button btn-sm btn-primary">提交</button>
</h1>

</div>
<div class="row">
	<div class="col-xs-12">	
		
		<div class="form-horizontal">
			
			{if condition="$Request.param.id"}
			<input name="id" type="hidden" value="{$Request.param.id}" />
			{/if}
			
			
			<div class="form-group">
				<label class="col-sm-2 control-label"> * 分类 </label>
				<div class="col-sm-4">							
					<select class="form-control" name="cid">
						{volist name="category" id="c"}
						<option {if condition="(isset($option)) AND ($option['cid'] eq $c['id'])"} selected="selected" {/if} value="{$c.id}">{$c.name}</option>
						{/volist}								
					</select>
				</div>
			</div>
			
			
			<div class="form-group">
				<label class="col-sm-2 control-label"> * 选项名称 </label>
			<div class="col-sm-10">
				<div class="clearfix">
					<input name="name" id="name" class="col-xs-10 col-sm-5"  value="{$option.name|default=''}" type="text">
				</div>
			</div>			 
			</div>
			
			
			
			<div class="form-group">
				<label class="col-sm-2 control-label"> * 类型 </label>
				<div class="col-sm-4">							
					<select class="form-control" name="type">
						
						
						
						
						<option <?php if(isset($option)&&$option['type']=='radio'){echo ' selected="selected"';} ?> value="radio">单选组</option>
						<!--
						<option <?php if(isset($option)&&$option['type']=='txt'){echo ' selected="selected"';} ?> value="txt">文本</option>
						<option <?php if(isset($option)&&$option['type']=='txtarea'){echo ' selected="selected"';} ?> value="txtarea">文本框</option>
						<option <?php if(isset($option)&&$option['type']=='num'){echo ' selected="selected"';} ?> value="num">数字</option>						
						<option <?php if(isset($option)&&$option['type']=='time'){echo ' selected="selected"';} ?> value="time">日期</option>					
						
						<option <?php if(isset($option)&&$option['type']=='num_section'){echo ' selected="selected"';} ?> value="num_section">数字区间</option>						
						<option <?php if(isset($option)&&$option['type']=='time_section'){echo ' selected="selected"';} ?> value="time_section">时间区间</option>	
						<option <?php if(isset($option)&&$option['type']=='select'){echo ' selected="selected"';} ?> value="select">下拉列表(单选)</option>
						
						<option <?php if(isset($option)&&$option['type']=='checkbox'){echo ' selected="selected"';} ?> value="checkbox">多选组</option>					
						-->
						
					</select>
				</div>
			</div>
			
			<div id="option-value-content">
				<table id="option-value" class="table table-striped table-bordered table-hover">
					<thead>
						<tr>
							<td class="text-left required">选项值：</td>						
							<td class="text-left">  排序：</td>
							<td></td>
						</tr>
					</thead>
					<tbody>
						<?php $option_value_row = 1; ?>
						<?php if(isset($option_values)){ ?>
						<?php foreach ($option_values as $option_value) { ?>
			              <tr id="option-value-row<?php echo $option_value_row; ?>">
			                <td class="text-left">
			                	<input class="form-control" type="text" name="option_value[<?php echo $option_value_row; ?>][name]" value="<?php echo $option_value['value_name']; ?>" />
			                </td>
			               
			                <td class="text-right"><input class="form-control"  type="text" name="option_value[<?php echo $option_value_row; ?>][sort_order]" value="<?php echo $option_value['value_sort_order']; ?>"/></td>
			                <td class="text-left"><button type="button" onclick="$('#option-value-row<?php echo $option_value_row; ?>').remove();" data-toggle="tooltip"  class="btn btn-danger"><i class="fa fa-trash"></i></button></td>
			              </tr>
			              <?php $option_value_row++; ?>
			              <?php } ?>
			              <?php } ?>
					</tbody>
				</table>
				<div>
					<a class="add_image btn btn-primary " onclick="addOptionValue();">添加选项值</a>
				</div>
			</div>
		</div>
	</div>
</div>
{/block}
{block name="javascript"}

<script>

$('select[name=\'type\']').on('change', function() {
	if (this.value == 'select' || this.value == 'radio' || this.value == 'checkbox') {
		$('#option-value-content').show();
	} else {
		$('#option-value-content').hide();
	}
});

$('select[name=\'type\']').trigger('change');

var option_value_row = '<?php echo $option_value_row; ?>';

function addOptionValue() {
	html  = '<tr id="option-value-row' + option_value_row + '">';		
	html += '<td class="text-left">';
	html += '<div><input type="text" name="option_value[' + option_value_row + '][name]" value=""  class="form-control" />';
    html += '</div>';	
	html += '</td>';
	html += '  <td class="text-right"><input type="text" name="option_value[' + option_value_row + '][sort_order]" value="' + option_value_row + '" class="form-control" /></td>';
	html += '  <td class="text-left"><button type="button" onclick="$(\'#option-value-row' + option_value_row + '\').remove();" data-toggle="tooltip"  class="btn btn-danger"><i class="fa fa-trash"></i></button></td>';
	html += '</tr>';	
	
	$('#option-value tbody').append(html);
	
	option_value_row++;
}


var back_index="{:url('Option/index')}";

$('.button').click(function(){
	$.post(
		'{$action}',
		$('input[type=\'text\'],select,input[type=\'hidden\']'),
		function(d){
			art_dialog(d,back_index);
		}
	);
});

</script>							
{/block}